import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'dva'
import { sexTypeData } from 'utils/seletLocalData'
import { Button, Row, Col } from 'antd'
import { List, Page } from 'components'
import { ListMenuType, titleType } from 'utils/enums'
import { routerRedux } from 'dva/router'
import { parseCIDR } from 'ipaddr.js'
import { findValueByKey } from 'utils'
import styles from '../../themes/list.less'
import { Record } from 'immutable';

const EntityDirector = ({ dispatch, entityDirector, location }) => {
  const { data, entityId, roleOptions } = entityDirector
  const listProps = {
    dataSource: data,
    menuType: ListMenuType.MENU_UPDATE + ListMenuType.MENU_DELETE,
    location,
    columnsData: [
      {
        title: 'FirstName',
        dataIndex: 'firstName',
        key: 'firstName',
      },
      {
        title: 'LastName',
        dataIndex: 'lastName',
        key: 'lastName',
      },
      {
        title: 'Title',
        dataIndex: 'title',
        key: 'title',
        render: (record) => {
          const result = findValueByKey(titleType, record)
          return result
        },
      },
      {
        title: 'Role',
        dataIndex: 'role',
        key: 'role',
        render: (text, record) => {
          let result = ''
          for (let o of roleOptions) {
            if (o.code == record.role) {
              result = o.name
            }
          }
          return <span>{result}</span>
        },
      },
      {
        title: 'Gender',
        dataIndex: 'gender',
        key: 'gender',
        render: (record) => {
          const result = findValueByKey(sexTypeData, record)
          return result
        },
      },
    ],
    onEditItem (value) {
      dispatch(routerRedux.push({
        pathname: `/entityDirectorData/${entityId}/${value && value.id}`,
      }))
    },
    onDeleteItem (value) {
      dispatch({
        type: 'entityDirector/delete',
        payload: {
          personId: value,
          entityId,
        },
      })
      dispatch({
        type: 'entityDirector/list',
        payload: {
          id: entityId,
        },
      })
    },
  }
  const onAdd = () => {
    dispatch(routerRedux.push({
      pathname: `/entityDirectorData/${entityId}/new`,
    }))
  }
  return (
    <Page inner>
      <Row style={{ marginBottom: 10 }} type="flex" justify="end">
        <Col>
          <Button size="large" type="ghost" onClick={onAdd}>Create</Button>
        </Col>
      </Row>
      <List {...listProps} />
    </Page>
  )
}

EntityDirector.PropTypes = {

}

export default connect(({ entityDirector, dispatch }) => ({ entityDirector, dispatch }))(EntityDirector)
